<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <link href="assets/css/bootstrap.min.css" rel="stylesheet" />
  <link rel="stylesheet" href="assets/css/ace.min.css" />
  <link rel="stylesheet" href="css/style.css"/>
    <link rel="stylesheet" href="assets/css/font-awesome.min.css" />
  <!--[if IE 7]>
    <link rel="stylesheet" href="assets/css/font-awesome-ie7.min.css" />

  <![endif]-->
 <script type="text/javascript" src="js/vue.min.js"></script>
 <script type="text/javascript" src="js/axios.js"></script>
 <!-- 引入样式 -->
 <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
 <!-- 引入组件库 -->
 <script src="https://unpkg.com/element-ui/lib/index.js"></script>
<title>模板维护</title>
</head>

<body>
<div id="app">
<div class="page-content">
 <div class="Manager_style">
  <span class="title_name">询价模板</span>
   <div class="XJ_template_style">
    <div class="select_gys clearfix">
     <el-checkbox-group v-model="selData">
      <el-checkbox :label="i.name" v-for="i in inquiryData"></el-checkbox>
     </el-checkbox-group>
    <button type="button" class="btn  btn-primary Browse_MB">浏览</button>
   </div>
   <div class="fillin_style">
    <div class="mb_name">模板名称<input  type="text" v-model="m_name" style="width:250px"/></div>
    <div class="info">
     <table class="table table-striped table-bordered table-hover">
      <thead>
       <tr>
        <th rowspan="2">产品名称</th>
        <th rowspan="2">数量</th>
        <th rowspan="2">单位</th>
        <th rowspan="2">投标当天最高限价(元/吨)</th>
        <th rowspan="2" >报价当天最高限价(元/吨)</th>
        <th colspan="2" v-for="s in selData">{{s}}</th>
       </tr>
       <tr >
        <template v-for="s in selData">
          <th>入围价</th>
         <th>最高限价</th>
        </template>
       </tr>
      </thead>
      <tbody>
       <tr v-for="(p,index1) in proData">
        <td>{{p.name}}</td>
        <td></td>
        <td>吨</td>
        <td><input v-model="suData[index1].now_fix" type="text" /></td>
        <td></td>
        <template v-for="(s,index2) in selData">
        <td><input v-model="addData[(index1*selData.length)+index2].finalist" type="text" /></td>
        <td></td>
        </template>
       </tr>
      </tbody>
     </table>
      <button class="btn btn-primary" type="button" @click="sc()">生成模板</button>
    </div>
   </div>
   </div>
 </div>
 <div class="Manager_style">
  <span class="title_name">询价模板列表</span>
   <div class="XJ_template_list">
    <table class="table table-striped table-bordered table-hover">
     <thead>
      <tr><th>序号</th><th>模板名称</th><th>生成模板时间</th><th>操作</th></tr>
     </thead>
     <tbody>
      <tr v-for="(i,index) in inquiryList">
       <td>{{i.m_id}}</td>
       <td>{{i.m_name}}</td>
       <td>{{i.m_date}}</td>
       <td> <button type="button" class="btn btn-warning" @click="del(i.m_id,index)">删除</button></td>
      </tr>

     </tbody>
    </table>
   </div>
 </div>
</div>
</div>

<script>
     new Vue({
      el:"#app",
      data:{
       //询价模板数据
         inquiryData:[],
       //选中的模板数据
       selData:[],
       //产品模板
       proData:[],
       //供应商模板数据
       moduleData:[],
       //询价模板列表
       inquiryList:[],
       //模板id
       m_id:1,
       //模板生成对象

       //模板数组对象
       addData:[],
       //投标当天最高限价数组
       suData:[],
       //模板名称
       m_name:'',

      },
      methods:{
         getInfo(){
          axios.get("modules/findAll.do").then(dt =>{
              this.inquiryList=dt.data
           axios.get("modules/findAllSupplier.do").then(dt =>{
            this.inquiryData=dt.data
            for (let i = 0; i < this.inquiryData.length; i++) {
             this.selData.push(this.inquiryData[i].name)
            }

            axios.get("modules/findAllProduct.do").then(dt => {
             this.proData = dt.data
             for (let i = 0; i < this.proData.length; i++) {
              let addObj = {
               supplier: '',
               breed: '',
               finalist: 0,
               now_fix: 0
              };
              let suObj = {
               now_fix: 0
              };
              for (let j = 0; j < this.selData.length; j++) {
               let newAddObj = {...addObj}; // 创建一个新的对象副本
               newAddObj.supplier = this.selData[j];
               newAddObj.breed = this.proData[i].name;
               this.addData.push(newAddObj);
              }
              this.suData.push({...suObj}); // 创建一个新的对象副本
             }
            })

           })
          })
         },
       sc(){
          let mn=JSON.stringify(this.m_name)
                  axios.get("modules/addModuleList.do?m_name="+mn).then(dt =>{

                   for (let i = 0; i < this.proData.length; i++) {
                    for (let j = 0; j < this.selData.length; j++) {
                     if (this.suData[i].now_fix !== 0) {
                      let now_fix=parseInt(this.suData[i].now_fix)
                      let finalist=parseInt(this.addData[(i*this.proData.length)+j].finalist)
                      let breed=encodeURIComponent(JSON.stringify(this.addData[(i*this.proData.length)+j].breed));
                      let supplier=encodeURIComponent(JSON.stringify(this.addData[(i*this.proData.length)+j].supplier));
                      axios.get("modules/addModules.do?m_id=" + dt.data + "&supplier=" + supplier
                              + "&breed=" + breed + "&finalist=" + finalist +
                              "&now_fix=" +now_fix)
                     }
                    }
                   }
                   this.$message({
                    type: 'success',
                    message: '模板生成成功!'
                   });
                           axios.get("modules/findAll.do").then(dt => {
                            this.inquiryList = dt.data
                           })
          })


       },
       del(m_id,index){
          axios.get("modules/del.do?m_id="+m_id)
          this.inquiryList.splice(index,1)
         this.$message({
          type: 'success',
          message: '删除成功!'
         });

       }
      },
      mounted(){
         this.getInfo();
      }
     })
</script>

</body>
</html>
